---
import { categories,  } from "./constants";
import Products from "./components/Products";

import Layout from "../../layouts/Layout.astro";
import Footer from "../../components/Footer";
import Navbar from "../../components/Navbar/";

// Get the current language from URL params or cookies
interface Props {
  lang: string;
  category: string;
}

const { lang = "en", category = "indoorCam" } = Astro.props;


const currentLang = lang === "ar" ? "ar" : "en";
const isRtl = currentLang === "ar";
// Define configurable menu items with translations
// const menuItems = [];
const menuItems = [
  {
    en: "Home",
    ar: "الرئيسية", // 正确翻译：首页
    url: "/",
    activeName: "Home",
  },
  {
    en: "Product",
    ar: "المنتج", // 正确翻译：产品
    url: "/products/",
    activeName: "product",
  },
  {
    en: "App & Services",
    ar: "التطبيقات والخدمات", // 正确翻译：应用与服务
    url: "/appAndServices/",
    activeName: "appAndServices",
  },
  {
    en: "About us",
    ar: "عنّنا", // 正确翻译：关于我们
    url: "/aboutUs/",
    active: false,
    activeName: "aboutUs",
  },
];
---

<Layout title="icam365" lang={currentLang}>
  <!-- <Header /> -->
  <main class={isRtl ? "rtl" : "ltr"}>
    <Navbar logo="tapo" menuItems={menuItems} currentLanguage={currentLang} client:only />
    <Products lang={lang} categories={categories}  category={category} client:only />
    <Footer lang={lang} client:only />
  </main>
</Layout>
